<template>
  <div>
    <el-form-item label="申领情况">
      <el-select v-model="value.unloadingStatus" :disabled="disabled" placeholder="请选择" class="input" @change="handleChange">
        <el-option
          v-for="dict in dict.type.evn_pollution_apply_status"
          :key="dict.value"
          :label="dict.label"
          :value="dict.value"
        />
      </el-select>
    </el-form-item>
    <template v-if="value.unloadingStatus === '已申领'">
      <el-form-item label="排污类型">
        <el-select v-model="value.unloadingType" :disabled="disabled" placeholder="请选择" class="input" @change="handleChange">
          <el-option
            v-for="dict in dict.type.env_unloading_type"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="申领、变更、延续时间" class="line-one">
        <el-date-picker
          v-model="value.unloadingDate"
          :disabled="disabled"
          type="date"
          format="yyyy年MM月dd日"
          placeholder="选择时间"
          class="input"
          @change="handleChange"
        />
      </el-form-item>
      <el-form-item label="开始时间">
        <el-date-picker
          v-model="value.unloadingValidityBegin"
          :disabled="disabled"
          type="date"
          format="yyyy年MM月dd日"
          placeholder="选择时间"
          class="input"
          @change="handleChange"
        />
      </el-form-item>
      <el-form-item label="结束时间">
        <el-date-picker
          v-model="value.unloadingValidityEnd"
          :disabled="disabled"
          type="date"
          format="yyyy年MM月dd日"
          placeholder="选择时间"
          class="input"
          @change="handleChange"
        />
      </el-form-item>
    </template>
  </div>
</template>
<script>
import { formatDatetime } from '@/utils'

export default {
  name: 'Sweage',
  dicts: ['evn_pollution_apply_status', 'env_unloading_type'],
  props: {
    disabled: Boolean,
    value: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {

    }
  },
  methods: {
    handleChange() {
      if (this.value.unloadingDate) this.value.unloadingDate = formatDatetime(this.value.unloadingDate, 'YYYY-MM-DDTHH:mm:ss')
      if (this.value.unloadingValidityBegin) this.value.unloadingValidityBegin = formatDatetime(this.value.unloadingValidityBegin, 'YYYY-MM-DDTHH:mm:ss')
      if (this.value.unloadingValidityEnd) this.value.unloadingValidityEnd = formatDatetime(this.value.unloadingValidityEnd, 'YYYY-MM-DDTHH:mm:ss')
      this.$emit('input', this.value)
      this.$emit('change', this.value)
    }
  }
}
</script>
